
<template>
  <div class="app-container">
      <el-row>
          <el-card :body-style="{padding:'10px'}">
              <div class="tabs">
                  <div class="tab-item"  :class="{actived:index===activedIndex}" v-for="(val,index) in tabs" :key="index" @click="changeTab(index)">{{val}}</div>
              </div>
          </el-card>
      </el-row>

      <el-row :style="{marginTop:'20px'}" v-if="activedIndex===0">
          <el-card :body-style="{padding:'10px'}">
               <el-form  label-position="left" label-width="68px" class="search-form-statistic" ref="ruleForm">
                   <el-row :gutter="20">
                        <!-- <el-col :span="6">
                            <el-form-item label="组织机构" style="margin-bottom: 0!important;">
                                <el-input class="filter-item" placeholder="请选择组织机构" v-model="deptId"></el-input>
                            </el-form-item>
                        </el-col> -->
                        <el-col :span="6">
                            <el-form-item label="账户名" style="margin-bottom: 0!important;">
                                <el-input class="filter-item" placeholder="请输入名称" v-model.trim="acountName"></el-input>
                            </el-form-item>
                        </el-col>
                   </el-row>
                    <el-row >
                        <el-col :span="24">
                            <el-form-item label="推送方式" style="margin-bottom: 0!important;">
                               <el-radio-group v-model="pushType">
                                    <el-radio label="" >全部</el-radio>
                                    <el-radio label="全员推送" >全员推送</el-radio>
                                    <el-radio label="不推送" >不推送</el-radio>
                                    <el-radio label="按板块推送" >按板块推送</el-radio>
                                    <el-radio label="按个股推送" >按个股推送</el-radio>
                                </el-radio-group>
                            </el-form-item>
                        </el-col>
                   </el-row>
                    <el-row :gutter="40">
                        <el-col :span="20">
                            <el-form-item label="统计区间" style="margin-bottom: 0!important;">
                               <el-radio-group v-model="countRangeType">
                                    <!-- <el-radio :label="0" >今日</el-radio> -->
                                    <el-radio :label="1" >昨日</el-radio>
                                    <el-radio :label="2" >本周</el-radio>
                                    <el-radio :label="3" >上周</el-radio>
                                    <el-radio :label="4" >本月</el-radio>
                                    <el-radio :label="5" >上月</el-radio>
                                    <el-radio :label="6" >自定义&nbsp;
                                        <el-date-picker
                                        v-model="timeRange"
                                        type="daterange"
                                        value-format="yyyy-MM-dd"
                                        :disabled="countRangeType!==6"
                                        range-separator="~"
                                         :picker-options="pickerOptions"
                                        start-placeholder="开始日期"
                                        end-placeholder="结束日期">
                                        </el-date-picker>
                                    </el-radio>
                                </el-radio-group>
                            </el-form-item>
                        </el-col>
                        <el-col :span="2">
                           <el-button
                                class="filter-item" type="primary"  @click.native="search"
                            >
                                查询
                            </el-button>
                        </el-col>
                         <el-col :span="2">
                           <el-button
                                class="filter-item"   @click.native="resetSearch"
                            >
                                重置
                            </el-button>
                        </el-col>
                   </el-row>

               </el-form>
          </el-card>
      </el-row>
      <el-row :style="{marginTop:'20px'}" v-if="activedIndex===1">
          <el-card :body-style="{padding:'10px'}">
               <el-form  label-position="left" label-width="68px" class="search-form-statistic">
                    <el-row >
                        <el-col :span="24">
                            <el-form-item label="推送方式" style="margin-bottom: 0!important;">
                               <el-radio-group v-model="pushType">
                                    <el-radio label="" >全部</el-radio>
                                    <el-radio label="全员推送" >全员推送</el-radio>
                                    <el-radio label="不推送" >不推送</el-radio>
                                    <el-radio label="按板块推送" >按板块推送</el-radio>
                                    <el-radio label="按个股推送" >按个股推送</el-radio>
                                </el-radio-group>
                            </el-form-item>
                        </el-col>
                   </el-row>
                    <el-row :gutter="40">
                        <el-col :span="20">
                            <el-form-item label="统计区间" style="margin-bottom: 0!important;">
                               <el-radio-group v-model="countTypeRangeType">
                                    <el-radio :label="0" >按日统计</el-radio>
                                    <el-radio :label="1" >按周统计</el-radio>
                                    <el-radio :label="2" >按月统计</el-radio>
                                     <el-radio :label="3" >自定义&nbsp;
                                        <el-date-picker
                                        v-model="yearRangeDate"
                                        type="daterange"
                                        range-separator="~"
                                         :picker-options="pickerOptions"
                                         :disabled='countTypeRangeType!=3'
                                        start-placeholder="开始日期"
                                        end-placeholder="结束日期">
                                        </el-date-picker>
                                     </el-radio>
                                </el-radio-group>
                            </el-form-item>
                        </el-col>
                        <el-col :span="2">
                           <el-button
                                class="filter-item" type="primary"  @click.native="search"
                            >
                                查询
                            </el-button>
                        </el-col>
                         <el-col :span="2">
                           <el-button
                                class="filter-item"   @click.native="resetSearch"
                            >
                                重置
                            </el-button>
                        </el-col>
                   </el-row>

               </el-form>
          </el-card>
      </el-row>
      <el-row :style="{marginTop:'20px'}" v-if="activedIndex===2">
          <el-card :body-style="{padding:'10px'}">
               <el-form  label-position="left" label-width="68px" class="search-form-statistic">
                    <el-row :gutter="40">
                        <el-col :span="8">
                            <el-form-item label="来源类型" style="margin-bottom: 0!important;">
                                <el-select v-model="fromTypes" placeholder="请选择">
                                    <el-option
                                    v-for="item in selectOptions"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                         <el-col :span="8">
                            <el-form-item label="资讯来源" style="margin-bottom: 0!important;">
                                <el-input class="filter-item" placeholder="请输入名称" v-model.trim="infoSource" clearable></el-input>
                            </el-form-item>
                        </el-col>
                   </el-row>
                    <el-row :gutter="40">
                        <el-col :span="24">
                            <el-form-item label="推送方式" style="margin-bottom: 0!important;">
                               <el-radio-group v-model="pushType">
                                    <el-radio label="" >全部</el-radio>
                                    <el-radio label="全员推送" >全员推送</el-radio>
                                    <el-radio label="不推送" >不推送</el-radio>
                                    <el-radio label="按板块推送" >按板块推送</el-radio>
                                    <el-radio label="按个股推送" >按个股推送</el-radio>
                                </el-radio-group>
                            </el-form-item>
                        </el-col>

                   </el-row>
                   <el-row>
                       <el-col :span="24">
                            <el-form-item label="异动新闻" style="margin-bottom: 0!important;">
                               <el-radio-group v-model="changeNewsType">
                                    <el-radio label="0" >全部</el-radio>
                                    <el-radio :label="1" >银小河浮窗</el-radio>
                                </el-radio-group>
                            </el-form-item>
                       </el-col>
                   </el-row>
                   <el-row>
                       <el-col :span="20">
                            <el-form-item label="统计区间" style="margin-bottom: 0!important;">
                               <el-radio-group v-model="countRangeType">
                                    <!-- <el-radio :label="0" >今日</el-radio> -->
                                    <el-radio :label="1" >昨日</el-radio>
                                    <el-radio :label="2" >本周</el-radio>
                                    <el-radio :label="3" >上周</el-radio>
                                    <el-radio :label="4" >本月</el-radio>
                                    <el-radio :label="5" >上月</el-radio>
                                    <el-radio :label="6" >自定义&nbsp;
                                         <el-date-picker
                                                v-model="timeRange"
                                                type="daterange"
                                                :disabled="countRangeType!==6"
                                                range-separator="~"
                                                 :picker-options="pickerOptions"
                                                start-placeholder="开始日期"
                                                end-placeholder="结束日期">
                                                </el-date-picker>
                                    </el-radio>
                                </el-radio-group>
                            </el-form-item>
                       </el-col>
                       <el-col :span="2">
                           <el-button
                                class="filter-item" type="primary"  @click.native="search"
                            >
                                查询
                            </el-button>
                        </el-col>
                         <el-col :span="2">
                           <el-button
                                class="filter-item"   @click.native="resetSearch"
                            >
                                重置
                            </el-button>
                        </el-col>
                   </el-row>

               </el-form>
          </el-card>
      </el-row>
       <el-row :style="{marginTop:'20px'}" v-if="activedIndex===1">
          <el-card :body-style="{padding:'10px'}">
              <div slot="header" class="clearfix">
                  <div class="sub-tabs">
                      <div class="tab-item" :class="{actived:index===activedSubIndex}" v-for="(val,index) in subtabs" :key="val.name" @click="changeSubTab(index)">{{val.name}}</div>
                  </div>
              </div>
               <div class="card-body">
                   <div id="chartLines">
                       <ve-line ref="lineChart" :data="chartData"  :loading='chartLoading' :colors="chartExtend.colors" :legend="chartLegend" :settings="chartSettings" :extend="chartExtend"></ve-line>
                   </div>
               </div>
          </el-card>
      </el-row>
      <el-row :style="{marginTop:'20px'}" v-if="activedIndex===0">
          <el-card :body-style="{padding:'10px'}">
              <div slot="header" class="clearfix">
                  <el-button class="filter-item" type="primary" @click.native="exportAccountExcel">导出excel</el-button>
              </div>
               <div class="card-body has-border">
                    <el-table stripe
                      :data="accountTableData" v-loading="listLoading" element-loading-text="加载中..."
                      border
                      fit
                      style="width: 100%"
                      id="out-table"
                    >
                        <!-- <el-table-column align="center" label="组织机构"  width="120"></el-table-column> -->
                        <el-table-column align="center" label="账户名" prop="accountName" width="120"></el-table-column>
                        <el-table-column label="原创资讯" align="center">
                            <el-table-column
                                label="创作数量"
                                prop="originalNewsAllCount"
                                align="center"
                               >
                            </el-table-column>
                            <el-table-column
                                prop="originalNewsAuditedCount"
                                label="审核数量"
                                 align="center"
                                >
                            </el-table-column>
                            <el-table-column
                                prop="originalNewsOnlineCount"
                                label="上线数量"
                                >
                            </el-table-column>
                            <el-table-column
                                prop="originalNewsRevocationCount"
                                label="撤回数量"
                                 align="center"
                               >
                            </el-table-column>
                            <el-table-column
                                prop="originalNewsFailureCount"
                                label="失效数量"
                                align="center"
                               >
                            </el-table-column>
                            <el-table-column
                                prop="originalNewsUVCount"
                                label="UV"
                                align="center"
                                >
                            </el-table-column>
                             <el-table-column
                                prop="originalNewsPVCount"
                                label="PV"
                                align="center"
                               >
                            </el-table-column>
                        </el-table-column>
                         <el-table-column label="智能资讯" align="center">
                            <!-- <el-table-column
                                prop="intelligentNewsAllCount"
                                label="总数量"
                                width="80">
                            </el-table-column> -->
                            <el-table-column
                                prop="intelligentNewsAuditedCount"
                                label="审核数量"
                                align="center"
                               >
                            </el-table-column>
                            <el-table-column
                                prop="intelligentNewsOnlineCount"
                                label="上线数量"
                                align="center"
                               >
                            </el-table-column>
                            <el-table-column
                                prop="intelligentNewsRevocationCount"
                                label="撤回数量"
                                align="center"
                               >
                            </el-table-column>
                            <el-table-column
                                prop="intelligentNewsFailureCount"
                                label="失效数量"
                                align="center"
                                >
                            </el-table-column>
                            <el-table-column
                                prop="intelligentNewsUVCount"
                                label="UV"
                                align="center"
                                >
                            </el-table-column>
                             <el-table-column
                                prop="intelligentNewsPVCount"
                                label="PV"
                                align="center"
                                >
                            </el-table-column>
                        </el-table-column>
                         <!-- <el-table-column label="银小河" align="center">
                            <el-table-column
                                prop="yinXiaoHeNewsAllCount"
                                label="总数量"
                                width="80">
                            </el-table-column>
                            <el-table-column
                                prop="yinXiaoHeNewsMarketCount"
                                label="按全市场"
                                width="80">
                            </el-table-column>
                            <el-table-column
                                prop="yinXiaoHeNewsIndustryCount"
                                label="按行业"
                                width="80">
                            </el-table-column>
                            <el-table-column
                                prop="yinXiaoHeNewsStockCount"
                                label="按个股"
                                width="80">
                            </el-table-column>
                            <el-table-column
                                prop="yinXiaoHeNewsType1Count"
                                label="新闻"
                                width="80">
                            </el-table-column>
                            <el-table-column
                                prop="yinXiaoHeNewsType2Count"
                                label="重磅"
                                align="center"
                                width="80">
                            </el-table-column>
                             <el-table-column
                                prop="yinXiaoHeNewsType3Count"
                                label="突发"
                                align="center"
                                width="80">
                             </el-table-column>
                             <el-table-column
                                prop="yinXiaoHeNewsType4Count"
                                label="解读"
                                align="center"
                                width="80">
                             </el-table-column>
                             <el-table-column
                                prop="yinXiaoHeNewsType5Count"
                                label="异动"
                                align="center"
                                width="80">
                            </el-table-column>
                            <el-table-column
                                prop="yinXiaoHeNewsType6Count"
                                label="公告"
                                align="center"
                                width="80">
                            </el-table-column>
                        </el-table-column> -->

                    </el-table>
                        <div class="pagination-container">
                        <el-pagination
                            background @size-change="handleSizeChange" @current-change="handleCurrentChange"
                            :current-page.sync="listQuery.pageNum"
                            :page-sizes="[10,20,30, 50]" :page-size="listQuery.pageSize"
                            layout="total, sizes, prev, pager, next, jumper" :total="total"
                        >
                        </el-pagination>
                    </div>
               </div>
          </el-card>
      </el-row>
      <el-row :style="{marginTop:'20px'}" v-if="activedIndex===1">
        <el-card :body-style="{padding:'10px'}">
            <div slot="header" class="clearfix">
                <el-button class="filter-item " type="primary" @click.native="exportPlatformExcel">导出excel</el-button>
            </div>
            <div class="card-body has-border">
                <el-table stripe
                    :data="platformTableData" v-loading="listLoading" element-loading-text="加载中..."
                    border
                    fit
                    style="width: 100%"
                    id="out-table"
                >
                    <el-table-column align="center" label="统计区间" prop="updateDate" width="120"></el-table-column>
                    <el-table-column label="原创资讯" align="center">
                        <el-table-column
                            label="创作数量"
                            prop="originalNewsAllCount"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="originalNewsAuditedCount"
                            label="审核数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="originalNewsOnlineCount"
                            label="上线数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="originalNewsRevocationCount"
                            label="撤回数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="originalNewsFailureCount"
                            label="失效数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="originalNewsUVCount"
                            label="UV"
                            align="center"
                            width="80">
                        </el-table-column>
                            <el-table-column
                            prop="originalNewsPVCount"
                            label="PV"
                            align="center"
                            width="80">
                        </el-table-column>
                    </el-table-column>
                        <el-table-column label="智能资讯" align="center">
                        <!-- <el-table-column
                            prop="intelligentNewsAllCount"
                            label="总数量"
                            width="80">
                        </el-table-column> -->
                        <el-table-column
                            prop="intelligentNewsAuditedCount"
                            label="审核数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="intelligentNewsOnlineCount"
                            label="上线数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="intelligentNewsRevocationCount"
                            label="撤回数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="intelligentNewsFailureCount"
                            label="失效数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="intelligentNewsUVCount"
                            label="UV"
                            align="center"
                            width="80">
                        </el-table-column>
                            <el-table-column
                            prop="intelligentNewsPVCount"
                            label="PV"
                            align="center"
                            width="80">
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="机器写稿" align="center">
                        <!-- <el-table-column
                            prop="autoWriteRobotNewsAllCount"
                            label="总数量"
                            width="80">
                        </el-table-column> -->
                        <el-table-column
                            prop="autoWriteRobotNewsAuditedCount"
                            label="审核数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="autoWriteRobotNewsOnlineCount"
                            label="上线数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="autoWriteRobotNewsRevocationCount"
                            label="撤回数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="autoWriteRobotNewsFailureCount"
                            label="失效数量"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="autoWriteRobotNewsUVCount"
                            label="UV"
                            align="center"
                            width="80">
                        </el-table-column>
                            <el-table-column
                            prop="autoWriteRobotNewsPVCount"
                            label="PV"
                            align="center"
                            width="80">
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="银小河" align="center">
                        <!-- <el-table-column
                            prop="yinXiaoHeNewsAllCount"
                            label="总数量"
                            width="80">
                        </el-table-column> -->
                        <el-table-column
                            prop="yinXiaoHeNewsMarketCount"
                            label="按全市场"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="yinXiaoHeNewsIndustryCount"
                            label="按行业"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="yinXiaoHeNewsStockCount"
                            label="按个股"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="yinXiaoHeNewsType1Count"
                            label="新闻"
                            width="80">
                        </el-table-column>
                        <el-table-column
                            prop="yinXiaoHeNewsType2Count"
                            label="重磅"
                            align="center"
                            width="80">
                        </el-table-column>
                            <el-table-column
                            prop="yinXiaoHeNewsType3Count"
                            label="突发"
                            align="center"
                            width="80">
                            </el-table-column>
                            <el-table-column
                            prop="yinXiaoHeNewsType4Count"
                            label="解读"
                            align="center"
                            width="80">
                            </el-table-column>
<!--                            <el-table-column-->
<!--                            prop="yinXiaoHeNewsType5Count"-->
<!--                            label="异动"-->
<!--                            align="center"-->
<!--                            width="80">-->
<!--                        </el-table-column>-->
                        <el-table-column
                            prop="yinXiaoHeNewsType6Count"
                            label="公告"
                            align="center"
                            width="80">
                        </el-table-column>
                    </el-table-column>

                </el-table>
                    <div class="pagination-container">
                    <el-pagination
                        background @size-change="handleSizeChange" @current-change="handleCurrentChange"
                        :current-page.sync="listQuery.pageNum"
                        :page-sizes="[10,20,30, 50]" :page-size="listQuery.pageSize"
                        layout="total, sizes, prev, pager, next, jumper" :total="total"
                    >
                    </el-pagination>
                </div>
            </div>
        </el-card>
      </el-row>
       <el-row :style="{marginTop:'20px'}" v-if="activedIndex===2">
        <el-card :body-style="{padding:'10px'}">
            <div slot="header" class="clearfix">
                <el-button class="filter-item" type="primary" @click.native="exportSourceExcel">导出excel</el-button>
            </div>
            <div class="card-body has-border">
                <el-table stripe
                    :data="sourceTableData" v-loading="listLoading" element-loading-text="加载中..."
                    border
                    fit
                    style="width: 100%"
                    id="out-table"
                >
                    <el-table-column align="center" label="来源类型"  width="120" prop="isOriginalName"></el-table-column>
                    <el-table-column prop="source" align="center" label="资讯来源" ></el-table-column>
                    <el-table-column align="center" label="创作数量"  width="80" prop="newsAllCount"></el-table-column>
                    <el-table-column align="center" prop="newsAuditedCount" label="审核数量"  width="80"></el-table-column>
                    <el-table-column align="center" prop="newsOnlineCount" label="上线数量"  width="80"></el-table-column>
                    <el-table-column align="center" prop="newsRevocationCount" label="撤回数量"  width="80"></el-table-column>
                    <el-table-column align="center" prop="newsFailureCount" label="失效数量"  width="80"></el-table-column>
                    <el-table-column align="center" label="UV"  prop="newsUVCount"  width="80"></el-table-column>
                    <el-table-column align="center" label="PV"  prop="newsPVCount" width="80"></el-table-column>
                </el-table>
                    <div class="pagination-container">
                    <el-pagination
                        background @size-change="handleSizeChange" @current-change="handleCurrentChange"
                        :current-page.sync="listQuery.pageNum"
                        :page-sizes="[10,20,30, 50]" :page-size="listQuery.pageSize"
                        layout="total, sizes, prev, pager, next, jumper" :total="total"
                    >
                    </el-pagination>
                </div>
            </div>
        </el-card>
      </el-row>
  </div>
</template>

<script>
/**
 *  资讯统计
 */

// 引入导出Excel表格依赖
import FileSaver from "file-saver";
import XLSX from "xlsx";
import moment from 'moment';
moment.locale('zh-cn')


import {
  getAcountlist,
  exportExcel_account,
  exportExcel_platform,
  exportExcel_source,
  getPlatformlist,
  getSourcelist,
  getPlatformChartlist
} from '@/api/newStatistics'

import {export_table_to_excel} from '@/vendor/Export2Excel'


export default {
    name:'newStatistics',
    data(){
        return{
            tabs:['按账户统计','按平台统计','按来源统计'],
            activedIndex:0,
            input1:'',
            acountName:'',
            deptId:'',
            countRangeType:1,
            countTypeRangeType:0,
            pushType:'',
            timeRange:[],
            copy_timeRange:[],
            yearRangeDate:[],
            copy_yearRangeDate:[],
            listQuery:{
                pageSize:12,
                pageNum:1
            },
            total:null,
            tableData:[],
            accountTableData:[],
            platformTableData:[],
            sourceTableData:[],
            listLoading:false,
            activedSubIndex:0,
            subtabs:[{name:'原创资讯',id:'0'},{name:'智能资讯',id:'1'},{name:'机器写稿',id:'2'},{name:'银小河',id:'3'}],
            chartType:'0',
            chartLoading:false,
            chartData:{
                columns:[],
                rows:[]
            },
            chartSettings:{
                labelMap:{}
            },
            chartLegend:{
                x:'center',      //可设定图例在左、右、居中
                y:'bottom',     //可设定图例在上、下、居中
                padding:[0,0,20,0],   //可设定图例[距上方距离，距右方距离，距下方距离，距左方距离]
                data: []
            },
            chartExtend:{
                colors:['#4bacc6','#c0504d','#9bbb59','#8064a2','#4bacc6','#7CFC00','#4B0082','#FFA500','#00FF7F','#9932CC'],
                series: {
                    smooth: false,
                    type:'line'
                }
            },
            fromTypes:'',
            selectOptions:[{
                value: '',
                label: '全部'
                }, {
                value: '0',
                label: '原创资讯'
                }, {
                value: '1',
                label: '智能资讯'
                }, {
                value: '2',
                label: '机器写稿'
            }],
            infoSource:'',
            changeNewsType:'',
            pickerOptions:{
                disabledDate:(time)=>{
                    return time.getTime() >Date.now() || time.getTime() === Date.now() ||time.getTime()< new Date().setFullYear((new Date().getFullYear() - 1))
                }
            }
        }
    },
    methods:{
        changeTab(index){
            this.activedIndex = index;
            this.resetSearch();
        },
        search(){
            let currentIndex = this.activedIndex;

            if(currentIndex===0){
                this.acountSearchList();
            }else if(currentIndex===1){
                this.platformSearchList();
                this.platformChartSearchList();
            }else{
                this.resourceSearchList();
            }
        },
        handleSizeChange(val) {
            this.listQuery.pageSize = val
            this.search();
        },
        handleCurrentChange(val) {
            this.listQuery.pageNum = val
            this.search();
        },
        //定义导出Excel表格事件
        exportExcel() {
            /* 从表生成工作簿对象 */
            const wb = XLSX.utils.table_to_book(document.querySelector("#out-table"));
            /* 获取二进制字符串作为输出 */
            const wbout = XLSX.write(wb, {
                bookType: "xlsx",
                bookSST: true,
                type: "array"
            });
            try {
                FileSaver.saveAs(
                //Blob 对象表示一个不可变、原始数据的类文件对象。
                //Blob 表示的不一定是JavaScript原生格式的数据。
                //File 接口基于Blob，继承了 blob 的功能并将其扩展使其支持用户系统上的文件。
                //返回一个新创建的 Blob 对象，其内容由参数中给定的数组串联组成。
                new Blob([wbout], { type: "application/octet-stream" }),
                //设置导出文件名称
                "账户统计.xlsx"
                );
            } catch (e) {
                if (typeof console !== "undefined") console.log(e, wbout);
            }
            return wbout;
        },
        table2excel(tableId,excelname=''){
            export_table_to_excel(tableId,excelname)
        },
        changeSubTab(index){
            this.activedSubIndex = index;
            this.chartType = this.subtabs[index].id;
            this.platformChartSearchList();
        },
        resetSearch(){
            this.acountName = '';
            this.deptId = '';
            this.countRangeType = 1;
            this.countTypeRangeType = 0;
            this.yearRangeDate = 1;
            this.pushType = '';
            this.timeRange = [...this.copy_timeRange];
            this.yearRangeDate = [...this.copy_yearRangeDate];
            this.changeNewsType = '';
            this.fromTypes = '';
            this.listQuery.pageNum = 1;
            this.listQuery.pageSize = 10;
            this.search();
        },
        // 账户统计的接口
        acountSearchList(){
            let that = this;
            let start = new Date(that.timeRange[0]);
            start = moment(start.getTime()).format('YYYY-MM-DD');
            let end = new Date(that.timeRange[1]);
            end = moment(end.getTime()).format('YYYY-MM-DD');
            const params = {
                deptId:this.deptId,
                accountName:this.acountName,
                pushChannel:this.pushType,
                startUpdateTime: new Date(start+' 00:00:00'),
                endUpdateTime:new Date(end+' 23:59:59'),
                pageSize:this.listQuery.pageSize,
                pageNum:this.listQuery.pageNum
            }

            this.listLoading = true;
            getAcountlist(params).then(res=>{
                this.accountTableData = Array.isArray(res.Data)?res.Data:[];
                this.listLoading = false;
                this.total = parseInt(res.PageInfo.Total);

            }).catch(err=>{
                  this.listLoading = false;
            })
        },
        // 平台统计的接口
        platformSearchList(){
            let that = this;
            let start = new Date(that.yearRangeDate[0]);
            start = moment(start.getTime()).format('YYYY-MM-DD');
            let end = new Date(that.yearRangeDate[1]);
            end = moment(end.getTime()).format('YYYY-MM-DD');

            const params = {
                pushChannel:this.pushType,
                rangeType:this.countTypeRangeType,
                startUpdateTime: new Date(start +' 00:00:00'),
                endUpdateTime:new Date(end +' 23:59:59'),
                pageSize:this.listQuery.pageSize,
                pageNum:this.listQuery.pageNum
            }

            this.listLoading = true;
            getPlatformlist(params).then(res=>{
                this.platformTableData = Array.isArray(res.Data)?res.Data:[];
                this.listLoading = false;
                this.total = parseInt(res.PageInfo.Total);
            }).catch(err=>{
                this.listLoading = false;
            })
        },
        // 平台图表数据
        platformChartSearchList(){
          let that = this;
          let start = new Date(that.yearRangeDate[0]);
          start = moment(start.getTime()).format('YYYY-MM-DD');
          let end = new Date(that.yearRangeDate[1]);
          end = moment(end.getTime()).format('YYYY-MM-DD');
            const params = {
                pushChannel:this.pushType,
                rangeType:this.countTypeRangeType,
                startUpdateTime: new Date(start+' 00:00:00'),
                endUpdateTime:new Date(end +' 23:59:59'),
                platformTypeForGraph:this.chartType
            }

           this.chartLoading = true;

            getPlatformChartlist(params).then(res=>{
                this.chartLoading = false;
                let tempList = Array.isArray(res.Data)?res.Data:[];
                if(this.chartType==='0'){
                        this.chartData.columns = ['time','originalNewsAllCount','originalNewsAuditedCount','originalNewsOnlineCount','originalNewsRevocationCount','originalNewsFailureCount'];
                         this.chartLegend.data = ['创作数量','审核数量','上线数量','撤回数量','失效数量']
                        this.chartSettings.labelMap = {
                            'originalNewsAllCount':'创作数量',
                            'originalNewsAuditedCount':"审核数量",
                            'originalNewsOnlineCount':"上线数量",
                            'originalNewsRevocationCount':"撤回数量",
                            'originalNewsFailureCount':"失效数量"
                        }
                        this.chartData.rows =  tempList.map(val=>{
                            return {
                               'time':val.updateDate,
                               'originalNewsAllCount':val.originalNewsAllCount,
                               'originalNewsAuditedCount':val.originalNewsAuditedCount,
                               'originalNewsOnlineCount':val.originalNewsOnlineCount,
                               'originalNewsRevocationCount':val.originalNewsRevocationCount,
                               'originalNewsFailureCount':val.originalNewsFailureCount
                            }
                        })
                }else if(this.chartType==='1'){
                        // 'intelligentNewsAllCount',
                        this.chartData.columns = ['time','intelligentNewsAuditedCount','intelligentNewsOnlineCount','intelligentNewsRevocationCount','intelligentNewsFailureCount'];
                         this.chartLegend.data = ['审核数量','上线数量','撤回数量','失效数量']
                        this.chartSettings.labelMap = {
                            // 'intelligentNewsAllCount':'总数量',
                            'intelligentNewsAuditedCount':"审核数量",
                            'intelligentNewsOnlineCount':"上线数量",
                            'intelligentNewsRevocationCount':"撤回数量",
                            'intelligentNewsFailureCount':"失效数量"
                        }
                        this.chartData.rows =  tempList.map(val=>{
                            return {
                               'time':val.updateDate,
                            //    'intelligentNewsAllCount':val.intelligentNewsAllCount,
                               'intelligentNewsAuditedCount':val.intelligentNewsAuditedCount,
                               'intelligentNewsOnlineCount':val.intelligentNewsOnlineCount,
                               'intelligentNewsRevocationCount':val.intelligentNewsRevocationCount,
                               'intelligentNewsFailureCount':val.intelligentNewsFailureCount
                            }
                        })
                }else if(this.chartType==='2'){
                    // 'autoWriteRobotNewsAllCount',
                        this.chartData.columns = ['time','autoWriteRobotNewsAuditedCount','autoWriteRobotNewsOnlineCount','autoWriteRobotNewsRevocationCount','autoWriteRobotNewsFailureCount'];
                         this.chartLegend.data = ['审核数量','上线数量','撤回数量','失效数量']
                        this.chartSettings.labelMap = {
                            // 'autoWriteRobotNewsAllCount':'总数量',
                            'autoWriteRobotNewsAuditedCount':"审核数量",
                            'autoWriteRobotNewsOnlineCount':"上线数量",
                            'autoWriteRobotNewsRevocationCount':"撤回数量",
                            'autoWriteRobotNewsFailureCount':"失效数量"
                        }
                        this.chartData.rows =  tempList.map(val=>{
                            return {
                               'time':val.updateDate,
                            //    'autoWriteRobotNewsAllCount':val.autoWriteRobotNewsAllCount,
                               'autoWriteRobotNewsAuditedCount':val.autoWriteRobotNewsAuditedCount,
                               'autoWriteRobotNewsOnlineCount':val.autoWriteRobotNewsOnlineCount,
                               'autoWriteRobotNewsRevocationCount':val.autoWriteRobotNewsRevocationCount,
                               'autoWriteRobotNewsFailureCount':val.autoWriteRobotNewsFailureCount
                            }
                        })
                }else{
                    // 'yinXiaoHeNewsAllCount',
                    this.chartData.columns = ['time','yinXiaoHeNewsMarketCount','yinXiaoHeNewsIndustryCount',
                    'yinXiaoHeNewsStockCount','yinXiaoHeNewsType1Count','yinXiaoHeNewsType2Count','yinXiaoHeNewsType3Count','yinXiaoHeNewsType4Count','yinXiaoHeNewsType5Count','yinXiaoHeNewsType6Count'];
                        this.chartSettings.labelMap = {
                            // 'yinXiaoHeNewsAllCount':'总数量',
                            'yinXiaoHeNewsMarketCount':"按全市场",
                            'yinXiaoHeNewsIndustryCount':'按行业',
                            'yinXiaoHeNewsStockCount':'按个股',
                            "yinXiaoHeNewsType1Count":"新闻",
                            "yinXiaoHeNewsType2Count":"重磅",
                            "yinXiaoHeNewsType3Count":"突发",
                            "yinXiaoHeNewsType4Count":"解读",
                            "yinXiaoHeNewsType5Count":"异动",
                            "yinXiaoHeNewsType6Count":"公告",

                        }
                        this.chartLegend.data = ['按全市场','按行业','按个股','新闻','重磅','突发','解读','异动','公告']
                        this.chartData.rows =  tempList.map(val=>{
                            return {
                               'time':val.updateDate,
                            //    'yinXiaoHeNewsAllCount':val.yinXiaoHeNewsAllCount,
                            'yinXiaoHeNewsMarketCount':val.yinXiaoHeNewsMarketCount,
                            'yinXiaoHeNewsIndustryCount':val.yinXiaoHeNewsIndustryCount,
                            'yinXiaoHeNewsStockCount':val.yinXiaoHeNewsStockCount,
                            "yinXiaoHeNewsType1Count":val.yinXiaoHeNewsType1Count,
                            "yinXiaoHeNewsType2Count":val.yinXiaoHeNewsType2Count,
                            "yinXiaoHeNewsType3Count":val.yinXiaoHeNewsType3Count,
                            "yinXiaoHeNewsType4Count":val.yinXiaoHeNewsType4Count,
                            "yinXiaoHeNewsType5Count":val.yinXiaoHeNewsType5Count,
                            "yinXiaoHeNewsType6Count":val.yinXiaoHeNewsType6Count,
                            }
                        })
                }

            }).catch(err=>{

            })
        },
        // 来源统计
        resourceSearchList(){
          let that = this;
          let start = new Date(that.timeRange[0]);
          start = moment(start.getTime()).format('YYYY-MM-DD');
          let end = new Date(that.timeRange[1]);
          end = moment(end.getTime()).format('YYYY-MM-DD');
             const params = {
                isOriginal:this.fromTypes,
                source:this.infoSource,
                pushChannel:this.pushType,
                scene:this.changeNewsType,
                pageSize:this.listQuery.pageSize,
                pageNum:this.listQuery.pageNum,
                startUpdateTime:new Date(start+' 00:00:00'),
                endUpdateTime:new Date(end +' 23:59:59')
            }

            this.listLoading = true;
            getSourcelist(params).then(res=>{
                this.sourceTableData = Array.isArray(res.Data)?res.Data:[];
                this.listLoading = false;
                this.total = parseInt(res.PageInfo.Total);
            }).catch(err=>{
                this.listLoading = false;
            })
        },
        // 获取 今日、昨日、本周、上周、本月、上月、最近一年的时间
        getTypeDate(type=1){
            let date = null;
            switch(type){
                case 0:
                    date = moment().format('YYYY-MM-DD');
                    date = [date,date]
                    break;
                case 1:
                     date = moment().subtract(1,'day').format('YYYY-MM-DD');
                     date = [date,date]
                    break;
                case 2:
                    date = moment().startOf('week');
                    date = [date.format('YYYY-MM-DD'),moment().format('YYYY-MM-DD')]
                    break;
                case 3:
                     date = moment().subtract(1,'week').startOf('week')
                     date = [date.format('YYYY-MM-DD'),date.endOf('week').format('YYYY-MM-DD')]
                    break;
                case 4:
                     date = moment().startOf('month');
                     date = [date.format('YYYY-MM-DD'),moment().format('YYYY-MM-DD')]
                    break;
                case 5:
                    date = moment().subtract(1,'month').startOf('month')
                    date = [date.format('YYYY-MM-DD'),date.endOf('month').format('YYYY-MM-DD')]
                    break;
                case 8:
                     date = moment().subtract(1,'year')
                     date = [date.format('YYYY-MM-DD'),moment().format('YYYY-MM-DD')]
                    break;
                default:
                    date = moment().format('YYYY-MM-DD')
                    date = [date,date]
            }
            return date;
        },
        // 账户  导出
        exportAccountExcel(){
             let that = this;
            const params = {
                deptId:this.deptId,
                accountName:this.acountName,
                pushChannel:this.pushType,
                startUpdateTime: new Date(that.timeRange[0]+' 00:00:00'),
                endUpdateTime:new Date(that.timeRange[1]+' 23:59:59'),
                pageSize:this.listQuery.pageSize,
                pageNum:this.listQuery.pageNum
            }

            exportExcel_account(params).then(response=>{
                const blob = new Blob([response], { type: 'application/vnd.ms-excel' });
                const fileName = '账户统计.xls';
                const linkNode = document.createElement('a');

                linkNode.download = fileName; //a标签的download属性规定下载文件的名称
                linkNode.style.display = 'none';
                linkNode.href = URL.createObjectURL(blob); //生成一个Blob URL
                document.body.appendChild(linkNode);
                linkNode.click();  //模拟在按钮上的一次鼠标单击

                URL.revokeObjectURL(linkNode.href); // 释放URL 对象
                document.body.removeChild(linkNode);
            }).catch(err=>{
                console.log('file-error',err);
            })
        },
        // 平台统计  导出
        exportPlatformExcel(){
             let that = this;
            const params = {
                pushChannel:this.pushType,
                startUpdateTime: new Date(that.timeRange[0]+' 00:00:00'),
                endUpdateTime:new Date(that.timeRange[1]+' 23:59:59'),
                rangeType:this.countTypeRangeType,
                pageSize:this.listQuery.pageSize,
                pageNum:this.listQuery.pageNum
            }

            exportExcel_platform(params).then(response=>{
                const blob = new Blob([response], { type: 'application/vnd.ms-excel' });
                const fileName = '平台统计.xls';
                const linkNode = document.createElement('a');

                linkNode.download = fileName; //a标签的download属性规定下载文件的名称
                linkNode.style.display = 'none';
                linkNode.href = URL.createObjectURL(blob); //生成一个Blob URL
                document.body.appendChild(linkNode);
                linkNode.click();  //模拟在按钮上的一次鼠标单击

                URL.revokeObjectURL(linkNode.href); // 释放URL 对象
                document.body.removeChild(linkNode);
            }).catch(err=>{
                console.log('file-error',err);
            })
        },
        // 来源统计  导出
        exportSourceExcel(){
             let that = this;
            const params = {
                 isOriginal:this.fromTypes,
                source:this.infoSource,
                pushChannel:this.pushType,
                scene:this.changeNewsType,
                pageSize:this.listQuery.pageSize,
                pageNum:this.listQuery.pageNum,
                startUpdateTime:new Date(this.timeRange[0]+' 00:00:00'),
                endUpdateTime:new Date(this.timeRange[1]+' 23:59:59')
            }

            exportExcel_source(params).then(response=>{
                const blob = new Blob([response], { type: 'application/vnd.ms-excel' });
                const fileName = '来源统计.xls';
                const linkNode = document.createElement('a');

                linkNode.download = fileName; //a标签的download属性规定下载文件的名称
                linkNode.style.display = 'none';
                linkNode.href = URL.createObjectURL(blob); //生成一个Blob URL
                document.body.appendChild(linkNode);
                linkNode.click();  //模拟在按钮上的一次鼠标单击

                URL.revokeObjectURL(linkNode.href); // 释放URL 对象
                document.body.removeChild(linkNode);
            }).catch(err=>{
                console.log('file-error',err);
            })
        }
    },
    created(){
        const dateRange =this.getTypeDate(1);
        this.timeRange = [...dateRange];
        this.copy_timeRange = [...dateRange];

         const yearDateRange =this.getTypeDate(1);
        this.yearRangeDate = [...yearDateRange];
        this.copy_yearRangeDate = [...yearDateRange];
        // let  date = this.getTypeDate(6);
        // console.log(date);
        this.search()
    },
    watch:{
        'countRangeType'(val){
            this.timeRange = this.getTypeDate(val);
        }
    }
}
</script>

<style lang="stylus" >

.tabs, .sub-tabs{
    display flex
    justify-content flex-start
    align-items center
    line-height 25px
    font-size 14px

    .tab-item{
        padding 0 15px
        border-top 1px solid #ddd
        border-left  1px solid #ddd
        border-bottom  1px solid #ddd
        cursor pointer
        &:last-child{
            border-right  1px solid #ddd
        }
        &.actived{
            color #0099CC
        }
    }
}
.has-border{
    .el-table thead th {
        border 1px solid #ebeef5 !important
    }
}
.card-body #chartLines{
    width 100%
    height 400px
}
.search-form-statistic .el-row{
  margin-bottom  10px !important
}
.search-form-statistic .el-radio{
    margin-right 10px
}
.search-form-statistic .el-range-editor{
    width 300px
}

</style>
